import React, {useEffect, useState} from "react";
import { Form, Input } from "antd";

import {ProBox, type WrappedComponentProps } from "@yaf/pro-ui";
import { prompt } from "@/service";

import { RespDataType, getAuthSecretInfo, updateAuthSecret, createAuthSecret } from '../../../api';

interface AuthSecretKeyProps extends WrappedComponentProps{
    accountId: string;
}

const AuthSecretKey: React.FC<AuthSecretKeyProps> = (props) => {
    const { form, loading, authSecretInfo } = useAuthSecretKey(props);
    // console.log("authSecretInfo->", authSecretInfo);
/*
     aiotClientId: string,
        aiotClientSecret: string,
        skyClientId: string,
        skyClientSecret: string,
        alarmClientId: string,
        alarmClientSecret: string,
*/
    return <ProBox loading={loading}>
        <Form
            form={form}
            labelCol={{span: 6}}
            wrapperCol={{span: 16}}
            initialValues={authSecretInfo || {}}
        >
            <Form.Item
                label="AIoT平台clientId"
                name="aiotClientId"
                // rules={[{required: true, message: "请填写用户名!"}]}
            >
                <Input />
            </Form.Item>
            <Form.Item
                label="AIoT平台clientSecret"
                name="aiotClientSecret"
            >
                <Input />
            </Form.Item>

            <Form.Item
                label="天擎平台clientId"
                name="skyClientId"
            >
                <Input />
            </Form.Item>
            <Form.Item
                label="天擎平台clientSecret"
                name="skyClientSecret"
            >
                <Input />
            </Form.Item>


            <Form.Item
                label="告警平台clientId"
                name="alarmClientId"
            >
                <Input />
            </Form.Item>
            <Form.Item
                label="告警平台clientSecret"
                name="alarmClientSecret"
            >
                <Input />
            </Form.Item>
        </Form>
    </ProBox>
}

export default AuthSecretKey;

const useAuthSecretKey = (props: AuthSecretKeyProps) => {
    const { modalControl, accountId } = props;
    const [ form ] = Form.useForm();
    const [ isUpdate, setIsUpdate ] = useState(false);
    const [ loading, setLoading ] = useState(true);
    const [ authSecretInfo, setAuthSecretInfo ] = useState<RespDataType.AuthSecretInfo>();

    useEffect(() => {
        modalControl.registerOk(handleSubmit)
    });

    useEffect(() => {
        setLoading(true);
        getAuthSecretInfo(accountId).then((resp) => {
            if(resp.data){
                setIsUpdate(true);
            }
            setAuthSecretInfo(resp.data);
            setLoading(false);
        })
    }, [])

    const handleSubmit = () => {
        form.validateFields().then((values) => {
            if(isUpdate){
                updateAuthSecret(accountId, values).then(() =>{
                    prompt.success("操作成功!");
                    modalControl.close();
                }).catch(() => modalControl.hideSaving());
            }else{
                createAuthSecret({...values, accountId}).then(() =>{
                    prompt.success("操作成功!");
                    modalControl.close();
                }).catch(() => modalControl.hideSaving());
            }

            // initAdminOfAccount(accountId, values).then(() =>{
            //     prompt.success("初始化成功!");
            //     modalControl.close();
            // }).catch(() => modalControl.hideSaving());
        }).catch(() => modalControl.hideSaving());
    }

    return { form, loading, authSecretInfo }
}
